const path = require('path');
const ReactRefreshWebpackPlugin = require('@pmmmwh/react-refresh-webpack-plugin');

module.exports = {
    mode: 'development', // 可以是 'development', 'production' 或 'none'
    entry: './src/index.ts', // 入口文件
    output: {
        filename: 'bundle.js', // 输出文件名
        path: path.resolve(__dirname, 'dist'), // 输出路径
    },
    resolve: {
        extensions: ['.js', '.jsx', '.ts', '.tsx'], // 处理文件扩展名
    },
    module: {
        rules: [
            {
                test: /\.ts$/, // 匹配TypeScript文件
                use: 'ts-loader', // 使用ts-loader来处理TypeScript文件
                exclude: /node_modules/, // 排除node_modules目录
            },
            {
                test: /\.less$/, // 匹配所有 .less 文件
                use: [
                    'style-loader', // 将 JS 字符串生成为 style 节点
                    'css-loader', // 将 CSS 转化成 CommonJS 模块
                    'less-loader' // 将 Less 编译成 CSS
                ]
            }
        ],
    },
};
